
// 给 验证码标签 写入 随机验证码
$('#sc').html(mySetVc()).click(function () { $('#sc').html(mySetVc()) });

// 账号input标签 失去焦点并且数据改变事件
$('[name="name"]').change(function () {
    // 当 失去焦点 并且 数据改变时 触发函数程序
    // 调用函数 向数据库验证 账号是不是存在
    isName();
})


// 给 注册按钮 添加点击事件
$('button').click(function () {
    // 获取数据
    let name = $('[name="name"]').val();
    let pwd1 = $('[name="pwd1"]').val();
    let pwd2 = $('[name="pwd2"]').val();
    let vc = $('[name="vc"]').val();

    // 简单的小验证

    // // 两次密码相同
    // if( pwd1 !== pwd2 ){
    //   // 两个密码不同 向span标签 写入提示信息
    //   $('[name="pwd1Span"]').html('您输入的两次密码不同');

    //   // 刷新验证码
    //   $('#sc').html( mySetVc() )

    //   // return终止之后程序的执行 
    //   return ;

    // }else{
    //   // 密码相同 清除提示信息
    //   $('[name="pwd1Span"]').html('');

    // }

    // // 验证码相同
    // if( vc.toLowerCase() !== $('#sc').html().toLowerCase() ){
    //   // 如果验证码不同 输入提示信息
    //   $('[name="vcSpan"]').html('您输入的验证码有误');

    //   // 刷新验证码
    //   $('#sc').html( mySetVc() )

    //   // return终止之后程序的执行 
    //   return ;

    // }else{
    //   // 验证码相同 清除 错误提示信息
    //   $('[name="vcSpan"]').html('');

    // }

    // 发送ajax请求
    getRegister(name, pwd1);

})

// async await 定义的函数 判断账号是不是存在功能
async function isName() {
    // 获取 数据 输入的账号
    let name = $('[name="name"]').val();

    const response = await myPromiseJQueryAjax('../server/goods_select_name.php', 'post', { userName: name }, 'json');
    console.log(response);

    // 根据结果动态渲染生成页面
    if (response.code === 0) {
        // 用户名重复不能使用
        $('[name="nameSpan"]').html('用户名重复 不能使用').css({ color: 'red' });

    } else if (response.code === 1) {
        // 用户名可以使用
        $('[name="nameSpan"]').html('恭喜您 用户名可以使用').css({ color: 'blue' });
    }

}

// async await 定义的函数 注册功能
// 参数1账号 参数2密码
async function getRegister(userName, userPwd) {

    // 使用 await 调用 封装的promise函数
    const response = await myPromiseJQueryAjax('../server/goods_register.php', 'post', { userName: userName, userPwd: userPwd }, 'json');
    console.log(response);

    // 根据 response 的结果 动态渲染生成页面
    // 5 秒 倒计时 跳转 登录页面
    let num = 5;

    // 写入提示信息内容
    $('[name="msg"]').html(`恭喜您注册成功 ${num}秒后跳转 登录页 点击跳转 <a href="./index.html">首页面</a> `);

    let time = setInterval(function () {
        num--;
        $('[name="msg"]').html(`恭喜您注册成功 ${num}秒后跳转 登录页 点击跳转 <a href="./index.html">首页面</a> `);
        if (num === 1) {
            // 清除定时器
            clearInterval( time );

            // 跳转 登录页 为了账号密码安全 只传参 账号的 id 
            window.location.href = `./login.html?id=${response.id}`;
        }


    }, 1000);
}

//  //登录注册切换函数
//  function registerHandler(e){
//   var bot1=bto.querySelector(".bot1");
//   var bot2=bto.querySelector(".bot2");
//   if(this.innerHTML==="登录"){
//       bot1.style.display="block";
//       bot2.style.display="none";
//   }else if(this.innerHTML==="注册" || this.innerHTML==="创建账号"){
//       bot1.style.display="none"
//       bot2.style.display="block";

//   }
// }

/*
  1, 生成验证码 点击 可以切换新的验证码
    通过 tools.js 中的函数生成随机验证码

  2, 对于账号是不是已经存在的验证判断
    给 账号input标签 添加 失去焦点并且数据改变 函数程序

      获取数据 

      向 server/goods_select_name.php 发送请求
        以 post 方式发请求
        携带 1个参数 键名是 
          userName
        响应体结果是 json 字符串

      账号可以使用 
        写入提示信息
      账号重复
        写入提示信息


  3, 给注册按钮添加点击事件

    获取数据

    验证判断数据
      简单验证 两个密码相同
      简单验证 验证码相同

    发送ajax请求
      调用 async await 声明的函数

      向 server/goods_register.php 文件发送请求
        以 post 方式发送请求 
        携带两个参数 键名是 
          userName  userPwd
        响应体格式是 json字符串

      注册失败:
        弹出提示信息 
        刷新 验证码 
        
      注册成功:
        5秒跳转 登录页 点击跳转首页面
        跳转登录页 携带 注册账号的id


 
 
 
*/
